<template>
  <div id="container">
    <bottom-header :currentSelected="selected" :relations="relations" />
    <div v-if="popList.length">
      <InfoPop :popList="popList" />
      </div>
      <div v-if="showAttrAnalysis && popList.length">
        <AttrAnalysis :popList="popList" @closeAttr="closeAttr" />
      </div>
      <div v-if="showAttrMonitor">
        <AttrMonitor @closeAttrMonitor="closeAttrMonitor"/>
      </div>
      <div v-if="showReleAnalysis">
        <ReleAnalysis :relations='relations' @closeRele="closeRele" />
      </div>
      <WarnTips />
       <div v-if="showRadarAttr">
        <AttrRadar @closeRadarAttr="closRadarAttr" :radarAttrObj='radarAttrObj' />
      </div>
      
    </div>
</template>

<script>
import BottomHeader from "../datav/bottomHeader.vue";
import CesiumPannel from "./cesiumInfoPannel.vue";
import InfoPop from "./infoPop.vue";
import AttrAnalysis from "./attrAnalysis.vue";
import ReleAnalysis from "./releAnalysis.vue";
import WarnTips from "./warnTips.vue";
import AttrRadar from "./attrRadar.vue";
// import EntityGenerator from '../../utils/EntityGenerator';
// import ColorUtils from '../../utils/ColorUtils';
import CesiumMap from "../../utils/CesiumMap";
import { Store } from "../../utils/store";
import { vm, SEND } from "../../utils/eventManage";
import AttrMonitor from "./attrMonitor.vue"

export default {
  name: "CesiumContainer",
  components: {
    BottomHeader,
    CesiumPannel,
    InfoPop,
    AttrAnalysis,
    ReleAnalysis,
    WarnTips,
    AttrRadar,
    AttrMonitor
  },
  data() {
    return {
      domainid: "1442329502297440256",
      selected: null,
      relations: [],
      showPop: false,
      showAttrAnalysis: false, //多维属性分析
      showReleAnalysis: false, //关联分析
      showRadarAttr:false,//雷达包络
      showAttrMonitor: false, // 属性监控
      popList: [],
      radarAttrObj:null
    };
  },
  beforeMount() {},
  mounted() {
    this.init();
    vm.$on(SEND.setPopup, data => {
      let arr = data.data;
      arr.forEach(element => {
        let pixel = element.pixel;
        let style = this.handleSetPosition(pixel);
        element.myStyle = style;
      });
      this.popList = arr;
    });
    vm.$on(SEND.showInfoPop, data => {
      let arr = this.popList;
      arr.forEach(element => {
        element.show = data.show;
      });
      this.popList = arr;
    });
    vm.$on(SEND.showAttrAnalysis, data => {
      this.showAttrAnalysis = data.show;
    });
    vm.$on(SEND.showReleAnalysis, data => {
      this.showReleAnalysis = data.show;
    });
    vm.$on(SEND.showRadarAttr, data => {
      this.showRadarAttr = data.show;
      this.radarAttrObj={
        position:data.position,
        pixel:data.pixel
      }
    });
    vm.$on(SEND.objectSelected, data => {
        this.selected = data.object;
    });
    
    vm.$on(SEND.showAttrMonitor, data => {
      this.showAttrMonitor = data.show;
    });

  },
  methods: {
    init() {
      // let Cesium = window.cesium;
      let Cesium = window.Cesium;
      let _this = this;
      Cesium.Ion.defaultAccessToken =
        "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJlYmEyZDRlZi05YTdhLTQxMjctOTEzMi05OWQ4OWYyZDgyYmIiLCJpZCI6Mjk0MDEsImlhdCI6MTYzMTg4MjQ5N30.f2LprDdQmPDlKj1nnAGBzNxuU-BOSX_ByllSK_UX_HQ";

      window.viewer = new Cesium.Viewer("container", {
        infoBox: false
      });
      window.viewer._cesiumWidget._creditContainer.style.display = "none"; // 隐藏版权

      this.axios
        .post(
          "http://bt1.geosts.ac.cn/api/dae/datastore/rest/v0.1.0/datastore/object/query1",
          {
            sdomains: [this.domainid],
            loadForm: true,
            loadObjType: true,
            loadNetwork: true
          }
        )
        .then(function(response) {
          _this.objects.push(...response.data.data.list);

          let cesiumMap = new CesiumMap(response.data.data.list, data => {
  
            _this.relations = data.relations;
          });
          Store.oneGis(cesiumMap);
        })
        .catch(function(error) {
          console.log(error);
        });
    },
    handleSetPosition(option) {
      if (option) {
        return {
          top: option.y - 50 + "px",
          left: option.x + 15 + "px",
          display: "block"
        };
      }
    },
    //关闭多维属性弹窗
    closeAttr() {
      this.showAttrAnalysis = false;
    },
    //关闭复杂关联分析
    closeRele() {
      this.showReleAnalysis = false;
    },
    closRadarAttr(){
      this.showRadarAttr=false
      vm.$emit(SEND.showRailWatch,{show:false})
    },
    closeAttrMonitor() {
      this.showAttrMonitor = false;
      vm.$emit(SEND.showAttrMonitor, {show: false});
    }
  }
};
</script>

<style lang="less">
#container {
  width: 100%;
  height: 100%;
  position: relative;
}
</style>
